<template>
  <div id="app">
    <el-table :data="tableData">
      <el-table-column prop="name" label="名字" sortable> </el-table-column>
      <el-table-column prop="kind" label="分类" sortable> </el-table-column>
      <el-table-column prop="url" label="地址">
        <template #default="scope">
          <a :href="scope.row.url" target="_blank">{{scope.row.url}}</a>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import list from '@/assets/list.json'
export default {
  name: "app",
  data(){
    return {
      tableData:{}
    }
  },
  created(){
    console.log(list);
    this.tableData=list.items;
  }
};
</script>

<style>
#app {
  width: 80%;
  margin: auto;
}
</style>
